<!-- 卡片>LOGO -->
<template>
  <div class="columnChart-logo">
    <div class="tittle">
      <div :class="platCode!=='sqzhjg'?'name':''">{{ defaultOrgName|| '智慧消防' }}</div>
      <div v-if="platCode!=='sqzhjg'" class="subname" :style="styles">{{subTitle}}</div>
    </div>
  </div>
</template>

<script>
import { mapState } from 'vuex'
import { getOrgPartInfo } from '@/api/sysMonitor'
//根据分平台标识加载logo。要有默认值
export default {
  data() {
    return {
      platCode: localStorage.getItem('ilinkBs_platformCode'),
      defaultOrgName: '',
      styles: '',
      subTitle: '',
    }
  },
  components: {},
  props: ['orgnizationId'],
  computed: {
    ...mapState(['platConfigInfo']),
  },
  watch: {
    platConfigInfo(val) {
      if (!this.orgnizationId) {
        this.defaultOrgName = val.simpleName
      }
    },
  },
  created() {
    if (ZHXF_IS_AIO) {
      this.defaultOrgName = this.platConfigInfo.simpleName
    } else {
      this.defaultOrgName = this.bsConfig.PlatManage.title
    }
    this.subTitle = this.bsConfig.PlatManage.subTitle || '应急指挥平台'
    if (this.orgnizationId) {
      getOrgPartInfo({
        orgId: this.orgnizationId,
      }).then((res) => {
        if (!this.bsConfig.PlatManage.customTitle) {
          this.defaultOrgName = res.data.orgShortName
        }
      })
    }
  },
}
</script>
<style scoped rel="stylesheet/scss" lang="scss">
.columnChart-logo {
  height: 100%;
  width: 100%;
  font-size: 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  .tittle {
    width: 100%;
    color: rgb(45, 174, 262);
    font-size: 2.2em;
    font-weight: bold;
    letter-spacing: 2px;
    .name {
      max-width: 230px;
      text-overflow: ellipsis;
      overflow: hidden;
      white-space: nowrap;
    }
    .subname {
      font-size: 22px;
      padding-top: 15px;
      text-indent: 10px;
    }
    div {
      margin: 0;
      padding: 0;
      float: left;
    }
  }
  img {
    width: 100%;
  }
}
</style>